Django তে ওয়েব অ্যাপ্লিকেশন তৈরি করার সময়, আপনি স্ট্যাটিক ফাইল (যেমন CSS, JavaScript, ইমেজ) ব্যবহার করতে পারেন যা আপনার ওয়েবসাইটের ডিজাইন এবং ইন্টারেকটিভ ফিচারগুলিকে সমর্থন করে। Django তে স্ট্যাটিক ফাইল হ্যান্ডলিং করার জন্য কিছু স্টেপ অনুসরণ করতে হয়, যেগুলো আপনাকে সহজেই এক্সটার্নাল CSS এবং JavaScript ফাইল লোড করতে সাহায্য করবে।
Django তে Static Files কনফিগারেশন
Django তে স্ট্যাটিক ফাইল ব্যবহারের জন্য প্রথমে কিছু কনফিগারেশন করা প্রয়োজন, বিশেষত settings.py ফাইলে।
১. settings.py ফাইলে Static Files কনফিগারেশন
প্রথমে আপনাকে STATIC_URL এবং STATICFILES_DIRS কনফিগার করতে হবে, যাতে Django জানে স্ট্যাটিক ফাইল কোথায় সংরক্ষিত থাকবে এবং কোথায় খুঁজতে হবে।
# settings.py
STATIC_URL = '/static/'
# স্ট্যাটিক ফাইলগুলো কোথায় রাখা হবে
STATICFILES_DIRS = [
BASE_DIR / "static", # আপনার প্রোজেক্টের রুট ডিরেক্টরিতে static ফোল্ডার
]
এখানে:
STATIC_URL: এটি আপনার ওয়েবসাইটের ইউআরএল পাথ যেখানে স্ট্যাটিক ফাইল অ্যাক্সেস করা যাবে।STATICFILES_DIRS: এখানে আপনি আপনার স্ট্যাটিক ফাইলের লোকেশন সুনির্দিষ্ট করেন (যেমনstatic/ফোল্ডারে)। এটি আপনার প্রোজেক্টের রুট ডিরেক্টরিতে থাকতে পারে।
২. urls.py তে Static Files কনফিগারেশন
স্ট্যাটিক ফাইল সার্ভ করার জন্য Django তে static() ফাংশন ব্যবহার করা হয়। সাধারণত, ডেভেলপমেন্ট পরিবেশে স্ট্যাটিক ফাইল সরাসরি Django সার্ভারে সার্ভ করা হয়।
# urls.py
from django.conf import settings
from django.conf.urls.static import static
urlpatterns = [
# অন্যান্য URL প্যাটার্নগুলো
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
এটি Django কে বলে দেয় যে স্ট্যাটিক ফাইলগুলোর জন্য STATIC_URL পাথ ব্যবহার করে STATIC_ROOT থেকে ফাইলগুলি সরবরাহ করতে হবে।
Django তে External CSS এবং JavaScript ফাইল লোড করা
এখন, স্ট্যাটিক ফাইল কনফিগার করার পর, আপনার HTML টেমপ্লেটে CSS এবং JavaScript ফাইলগুলি লোড করতে হবে।
১. Static Template Tag ব্যবহার করা
Django তে স্ট্যাটিক ফাইল লোড করার জন্য {% static %} টেমপ্লেট ট্যাগ ব্যবহার করতে হয়। এটি Django এর স্ট্যাটিক ফাইল সিস্টেমকে ইনভোক করে এবং সঠিক URL প্রদান করে।
২. External CSS ফাইল লোড করা
প্রথমে, আপনার static ফোল্ডারে একটি CSS ফাইল (যেমন style.css) রাখুন। এরপর, HTML টেমপ্লেটে এই CSS ফাইল লোড করতে হবে।
<!-- base.html (এটি মূল টেমপ্লেট হতে পারে) -->
{% load static %} <!-- static ট্যাগ লোড করা -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My Django Site</title>
<!-- External CSS লোড করা -->
<link rel="stylesheet" href="{% static 'css/style.css' %}">
</head>
<body>
<h1>Welcome to My Django Site!</h1>
<p>This is a sample paragraph with custom styling.</p>
</body>
</html>
এখানে:
{% load static %}: Django টেমপ্লেটে স্ট্যাটিক ফাইল লোড করার জন্য এই ট্যাগটি ব্যবহার করা হয়।{% static 'css/style.css' %}: এটিstaticফোল্ডারের মধ্যে অবস্থিতcss/style.cssফাইলের সঠিক ইউআরএল প্রদান করবে।
৩. External JavaScript ফাইল লোড করা
এভাবেই আপনি JavaScript ফাইলও লোড করতে পারেন। ধরুন আপনার static/js/script.js নামে একটি JavaScript ফাইল আছে। HTML টেমপ্লেটে এই ফাইলটি লোড করতে হবে।
<!-- base.html -->
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My Django Site</title>
<!-- External CSS লোড করা -->
<link rel="stylesheet" href="{% static 'css/style.css' %}">
</head>
<body>
<h1>Welcome to My Django Site!</h1>
<!-- External JavaScript লোড করা -->
<script src="{% static 'js/script.js' %}"></script>
</body>
</html>
এখানে:
<script src="{% static 'js/script.js' %}"></script>: এটি JavaScript ফাইল লোড করবে যাstatic/js/script.jsফোল্ডারে সংরক্ষিত।
Django তে স্ট্যাটিক ফাইল প্রোডাকশন পরিবেশে ব্যবহার করা
ডেভেলপমেন্ট পরিবেশে Django স্ট্যাটিক ফাইল সরাসরি সার্ভ করে, তবে প্রোডাকশন পরিবেশে সাধারণত স্ট্যাটিক ফাইলগুলি একটি আলাদা সার্ভার (যেমন Nginx) দ্বারা সার্ভ করা হয়। তাই প্রোডাকশন মোডে Django এ স্ট্যাটিক ফাইল কম্পাইল ও সংগ্রহ করার জন্য collectstatic কমান্ড ব্যবহার করা হয়।
python manage.py collectstatic
এই কমান্ডটি Django কে বলে দেয় যে স্ট্যাটিক ফাইলগুলো একত্রিত করে STATIC_ROOT ডিরেক্টরিতে সরিয়ে রাখতে। এরপর প্রোডাকশন সার্ভারে এসব ফাইল সরবরাহ করা যাবে।
সারাংশ
- Django তে স্ট্যাটিক ফাইল (CSS, JavaScript, ইমেজ) ব্যবহারের জন্য
STATIC_URLএবংSTATICFILES_DIRSকনফিগারেশন করতে হয়। - স্ট্যাটিক ফাইলগুলো টেমপ্লেটে
{% static %}টেমপ্লেট ট্যাগ ব্যবহার করে লোড করা হয়। - প্রোডাকশন পরিবেশে স্ট্যাটিক ফাইলগুলো
collectstaticকমান্ড দিয়ে একত্রিত এবং সরবরাহ করা হয়।
Read more
